<template>
    <div class="container">
        <el-form ref="form" :model="form" label-width="100px">
            <el-form-item label="URL编码">
            <el-input  type="textarea"
              placeholder="请输入"
              :autosize="{ minRows: 8, maxRows: 20 }"
              v-model="form.sourceData"></el-input>
            </el-form-item>
            <el-form-item label="URL编码结果">
            <el-input  type="textarea"
              readonly
              :autosize="{ minRows: 8, maxRows: 20 }"
              v-model="form.resultData"></el-input>
            </el-form-item>
            <el-form-item>
            <el-button type="primary" @click="onSubmit">编码</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
  <script>
    export default {
      data() {
        return {
          form: {
            sourceData: '',
            resultData: '',
          }
        }
      },
      methods: {
        onSubmit() {
          console.log('submit!');
        }
      }
    }
  </script>
  <style lang="less" scoped>
  .container {
    padding: 20px;
  }

  </style>